<template>
    <div class="hngkContent">
        <div class="hngkLeft">
            <LeftChange/>
        </div>
        <div class="hngkRight">
            <RightChange/>
        </div>
    </div>
</template>

<script>
import LeftChange from "./hngkLeft/LeftChange"
import RightChange from "./hngkRight/RightChange"
import {
  defineComponent,
  getCurrentInstance,
  onMounted,
  ref
} from 'vue'
import { useRouter } from 'vue-router'
export default defineComponent({
    components:{
        LeftChange,
        RightChange
    },
    setup(){
        onMounted(()=>{
            console.log("FX")
        })
        return {
            
        }
    }
})
</script>

<style lang="stylus" scoped>
    @import '../../assets/varibles.styl'
    .hngkLeft
        position: absolute
        top: vh(85)
        padding-top:vh(32)
        left: vw(0)
        padding-left:vw(24)
        width: vw(389)
        height: vh(995)
        box-sizing: border-box
        //background: linear-gradient(to right, rgba(0,0,0,.7) 60%, rgba(0,0,0,0));
        background: #00
    .hngkRight
        position: absolute
        top: vh(85)
        right: vw(0)
        padding-right:vw(24)
        width: vw(389)
        height: vh(995)
        box-sizing: border-box 
        //background: linear-gradient(to left, rgba(0,0,0,.7) 60%, rgba(0,0,0,0));
        background: #000
</style>